<template>
  <div class="c_policy_declare_company">
    <!-- banner -->
    <div class="banner">
      <img src="../../assets/images/banner.png" alt />
    </div>
    <div class="box">
      <div class="breadcrumb-nav">
        <el-breadcrumb separator=">">
          <el-breadcrumb-item>政策申报</el-breadcrumb-item>
          <el-breadcrumb-item>内容详情</el-breadcrumb-item>
        </el-breadcrumb>
      </div>

      <div class="box-content white">
          <h2>人才住房补贴申报<el-tag>申报中</el-tag></h2>
          <p class="p1">
              <span>政策申报</span>
              <span>发布时间：2020-06-03  13:18</span>
          </p>
          <p class="p2">
            <span>源政策：</span>
            <a href="javascript:void(0)">崖州湾科技人才管理政策</a>
          </p>
          <p class="p3">
            <span>申报主体：</span>企业
          </p>

          <p class="p4">
            <span>申报时间：</span>
            2019-02-25   至   2020-05-23
            <span>（注：超过申报时间将不允许提交申报材料）</span>
          </p>
          <h3>
              所有崖州湾科技城内企业员工，符合以下条件的均可申报，由员工所在企业统一收集材料信息上报：
          </h3>
          <p class="p5">
              1、毕业满一年的全日制本科学历及以上<br>
              2、非本市户口且在本市无自购住房<br>
              3、XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX<br>
              4、XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX<br>
              5、XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX<br>
          </p>
          <h2>申报填写</h2>
          <el-form :inline="true" class="demo-form-inline">
            <el-form-item label="申报企业">
              <el-input placeholder="请填入申报企业名称"></el-input>
            </el-form-item>
            <el-form-item label="申报人数">
              <el-input placeholder="请填入申报人数"></el-input>
              <span>人</span>
            </el-form-item>
          </el-form>
          <dl>
            <dt>企业材料</dt>
            <dd>
                <span>企业上报人才汇总表</span>
                <a href="javascript:void(0)">材料上传</a>
                <a href="javascript:coid(0)" class="a_underline">模板下载</a>
            </dd>
          </dl>
          <p class="tips">
            注：企业需按照模板要求汇总人员信息上报提交
          </p>
          <dl class="mt30">
            <dt>人才信息
                <a href="javascript:void(0)">+添加人员</a>
            </dt>
            <dd>
                <span class="width1">蔡文姬</span>
                <span class="width2">女</span>
                <span class="width3"><a href="javascript:void(0)" class="a_underline">2份</a>材料</span>
                <span><a href="javascript:void(0)" class="btn-edit">编辑</a><a href="javascript:void(0)" class="btn-del">删除</a></span>
            </dd>
            <dd>
                <span class="width1">
                    <el-input placeholder="输入人才姓名"></el-input>
                </span>
                <span class="width2">
                  <el-select placeholder="选择性别">
                    <el-option label="男" value="1"></el-option>
                    <el-option label="女" value="2"></el-option>
                  </el-select>
                </span>
                <span class="width3"><a href="javascript:void(0)" class="a_underline"> 材料上传</a></span>
                <span><a href="javascript:void(0)" class="btn-edit">保存</a><a href="javascript:void(0)" class="btn-del">取消</a></span>
            </dd>
            
          </dl>

          <el-form :inline="true" class="text-center">
             <el-form-item>
                <el-button type="primary" @click="onSubmit">确定提交</el-button>
                <el-button>暂存一下</el-button>
              </el-form-item>
          </el-form>
         
      </div>
      
    </div>
  </div>
</template>
<script>
import {} from "@/utils/js.js";
import {} from "@/services/api.js";
export default {
  components: {},
  data() {
    return {
      radio: '1',
      checked:true,
      banner: [],
      pagination:{
        current:1,
        size:10,
        total:132,
      }
    };
  },
  mounted() {
    this.content();
  },
  computed: {},
  watch: {
    "$i18n.locale"() {
      this.content();
    },
  },
  methods: {
    content() {},
    //首页跳转
    indexLink(data) {
      if (data.outLink && data.outLink == 1) {
        window.open(data.linkUrl, "-blank");
      } else {
        window.location.href = data.linkUrl;
      }
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
    },
    handleCurrentChange(val) {
      this.search.pageNo=val;
      this.getContentList();
    },
  },
};
</script>
<style lang="scss">
.c_policy_declare_company {
  .box-center {
    margin: 30px auto 50px auto;
    text-align: center;
  }
  .text-center{
    text-align: center;
  }
  .record{
    padding: 8px 0;
    font-size:12px;
    font-family:Microsoft YaHei;
    font-weight:400;
    line-height:16px;
    color:rgba(153,153,153,1);
    opacity:1;
  }
  .banner {
    img {
      max-width: 100%;
      min-width: 1200px;
      display: block;
    }
    .el-carousel--button {
      width: 12px;
      height: 12px;
      background: rgba(255, 255, 255, 1);
      border-radius: 50%;
      opacity: 1;
    }
    .el-carousel--indicator.is-active button {
      background-color: #0f54bc;
    }
  }
  .noRecord {
    text-align: center;
    padding: 144px 0;
    border-top: 1px solid rgba(204, 204, 204, 1);
    p:first-child {
      text-align: center;
    }
    p:nth-child(2) {
      margin-top: 25px;
      font-size: 14px;
      font-family: Microsoft YaHei;
      font-weight: 400;
      color: rgba(153, 153, 153, 1);
      opacity: 1;
    }
    p:last-child {
      margin-top: 36px;
      font-size: 16px;
      font-family: Microsoft YaHei;
      font-weight: 400;
      color: rgba(119, 119, 119, 1);
      opacity: 1;
      a {
        margin-left: 14px;
        font-family: Microsoft YaHei;
        font-weight: 400;
        color: rgba(15, 84, 188, 1);
        opacity: 1;
        text-decoration: underline;
      }
    }
  }
  .white {
    background: #fff;
  }
  .box {
    box-sizing: border-box;
    width: 1200px;
    margin: 0 auto;
    .breadcrumb-nav {
      font-size: 13px;
      font-family: Microsoft YaHei;
      font-weight: 400;
      color: rgba(153, 153, 153, 1);
      opacity: 1;
      margin: 8px 0;
    }
    .box-content {
      margin-top: 6px;
      padding:18px 120px;
      h2:first-child{
        margin-top: 34px;
        text-align: center;
        font-size:22px;
        font-family:Microsoft YaHei;
        font-weight:bold;
        line-height:29px;
        color:rgba(51,51,51,1);
        opacity:1;
        .el-tag{
          margin-left: 10px;
          font-size:12px;
          font-family:Microsoft YaHei;
          font-weight:400;
          line-height:24px;
          color:rgba(15,84,188,1);
          opacity:1;
          background:rgba(15,84,188,0.1);
        }
      }
      p.p1{
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: center;
        span{
          margin:16px 15px;

        }
      }
       p.p2{
        margin: 10px 0;
        font-size:14px;
        font-family:Microsoft YaHei;
        font-weight:400;
        line-height:24px;
        color:rgba(51,51,51,1);
        opacity:1;
        a{
          font-size:14px;
          font-family:Microsoft YaHei;
          font-weight:400;
          line-height:24px;
          color:rgba(15,84,188,1);
          opacity:1;
        }
        span{
          margin-right:34px;
        }
      }
      p.p3{
        margin: 6px 0;
        font-size:14px;
        font-family:Microsoft YaHei;
        font-weight:400;
        line-height:24px;
        color:rgba(51,51,51,1);
        opacity:1;
        span{
          margin-right:20px;
        }
      }
      
      .demo-form-inline{
          display: flex;
          flex-wrap: nowrap;
          flex-direction: row;
          justify-content: space-between;
         .el-form-item__content,.el-form-item{
          display: flex;
          flex-wrap: nowrap;
          flex-direction: row;
        }
      }

      .el-form 
      {
        padding-top: 25px;
        border-top:1px solid rgba(239,239,239,1);
        .el-input__inner{
          width: 361px;
          margin-right: 10px;
        }
       
        .el-button:first-child{
          width:100px;
          height:36px;
          background:rgba(15,84,188,1);
          opacity:1;
          border-radius:2px;
          font-size:14px;
          font-family:MicrosoftYaHei;
          color:rgba(255,255,255,1);
          opacity:1;
        }
        .el-button:last-child{
          width:100px;
          height:36px;
          border:1px solid rgba(15,84,188,1);
          opacity:1;
          border-radius:2px;
          font-size:14px;
          font-family:MicrosoftYaHei;
          color:rgba(15,84,188,1);
          opacity:1;
        }
      }
      p.p4{
        margin: 12px 0;
        font-size:14px;
        font-family:Microsoft YaHei;
        font-weight:400;
        line-height:24px;
        color:rgba(51,51,51,1);
        opacity:1;
        span:first-child{
          margin-right:18px;
        }
        span:last-child{
          margin-left:12px;
          color:rgba(153,153,153,1);
        }
      }
      h3{
        font-size:14px;
        font-family:Microsoft YaHei;
        font-weight:400;
        line-height:24px;
        color:rgba(51,51,51,1);
        opacity:1;
        margin-bottom: 24px;
      }
      p.p5{
        font-size:14px;
        font-family:Microsoft YaHei;
        font-weight:400;
        line-height:24px;
        color:rgba(51,51,51,1);
        opacity:1;
        padding-bottom: 30px;
      }
      h2:nth-of-type(2){
        font-size:20px;
        font-family:Microsoft YaHei;
        font-weight:bold;
        line-height:24px;
        color:rgba(51,51,51,1);
        opacity:1;
        border-left:3px solid rgba(15,84,188,1);
        padding-left: 5px;
        margin-top:24px;
        margin-bottom: 19px;
      }
      .el-row{
        border-top: 1px solid rgba(239,239,239,1);
        .el-col span{
          display: inline-block;
          padding: 26px 15px 31px 15px;
        }
      }
      dl{
        border:1px solid rgba(239,239,239,1);
        dt{
          font-size:14px;
          font-family:Microsoft YaHei;
          font-weight:bold;
          line-height:19px;
          color:rgba(51,51,51,1);
          opacity:1;
          padding: 14px 22px;
          background: #f6f6f6;
           a{
            font-size:14px;
            font-family:Microsoft YaHei;
            font-weight:400;
            line-height:24px;
            color:rgba(15,84,188,1);
            opacity:1;
            margin-right: 5px;
            float: right;
          }
        } 
        dd{
          display: flex;
          flex-direction: row;
          flex-wrap: nowrap;
          justify-content: space-between;
          font-size:14px;
          font-family:Microsoft YaHei;
          font-weight:400;
          line-height:19px;
          padding:13px 22px;
          color:rgba(51,51,51,1);
          opacity:1;
          border-bottom: 1px solid rgba(239,239,239,1);
          .width1{
            width: 121px;
          }
          .width2{
            width: 128px;
          }
          .width3{
            width: 128px;
          }
          /*span:nth-of-type(2){
            font-size:12px;
            font-family:Microsoft YaHei;
            font-weight:400;
            line-height:24px;
            color:rgba(153,153,153,1)!important;
            opacity:1;
          }*/
          a{
            font-size:14px;
            font-family:Microsoft YaHei;
            font-weight:400;
            line-height:24px;
            color:rgba(15,84,188,1);
            opacity:1;
            margin-right: 5px;
          }
          .a_underline{
            text-decoration: underline;
          }
          /*
          a:last-child{
            font-family:Microsoft YaHei;
            font-weight:400;
            line-height:19px;
            font-size: 12px;
            color:rgba(15,84,188,1);
            text-decoration: underline;
          }
          a:last-child:hover{
            color:rgba(15,84,188,1);
          }*/
          .btn-edit{
            margin-right: 15px;
          }
          .btn-del{
            font-size:14px;
            font-family:Microsoft YaHei;
            font-weight:400;
            color:rgba(102,102,102,1);
            opacity:1;
          }
        }
        dd:last-child{
          border:none;
        }
      }
      p.tips{
        font-size:12px;
        font-family:Microsoft YaHei;
        font-weight:400;
        line-height:16px;
        padding:4px 22px;
        color:rgba(153,153,153,0.99);
      }
      .mt30{
        margin-top:30px;
      }
    }
  }
}
</style>